<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div>
    <button id="btn">按钮</button>
</div>

<script>
var div = document.querySelector("div");

var btn = document.getElementById("btn");
btn.addEventListener("click", function (event){
    console.log("事件的类型", event.type);
    console.log("target", event.target);  // 永远指的是目标元素, 最内层元素
    console.log("currentTarget", event.currentTarget); // 注册在谁身上, 就是谁
    console.log("bubbles", event.bubbles);
    console.log("eventPhase", event.eventPhase); //得到事件所处的阶段  1 2 3
//    event.stopPropagation();   // 阻止事件的进一步向其他元素节点传播
//    event.stopImmediatePropagation();  //立即停止传播. 同一个元素的其他监听器也收不到


}, true);
btn.addEventListener("click", function (){
    console.log("btn第二个事件");
})
div.addEventListener("click", function (e){
    console.log("div.....");
}, true)

</script>
</body>
</html>